<template>
    <div class="offline">
        <div class="image">
            <img src="../../../assets/img/offline.png" alt="">
        </div>
        <p>预装机：<strong>100</strong>万/年</p>
        <div class="preloaded">
            <i></i>
            <p>手机预装、内置：运营商（移动、联通、电信）；手机厂商(华为、小米、联想、一加…）</p>
        </div>
        <div class="brush-machine">
            <i></i>
            <p>刷机：维修资源、国美门店资源、二手机资源…</p>
        </div>
        <div class="push">
            <i></i>
            <p>地推：包裹红包、门店活动、宣传单等</p>
        </div>
    </div>
</template>
<script>
export default {
    name: 'Offline',
    data () {
        return {

        }
    }
}
</script>
<style scoped>
.offline {
    padding-top: 60px;
}
.offline .image {
    width: 670px;
    height: 262px;
}
.offline .image img {
    width: 100%;
    height: auto;
}
.offline>p {
    font-size: 36px; /*px*/
    color: #1e90ff;
    margin-top: 40px;
    text-align: center;
}
.offline>p strong {
    color: #05173b;
    font-weight: bolder;
}
.offline .preloaded {
    margin-top: 60px;
    display: flex;
}
.offline .preloaded i,.offline .brush-machine i,.offline .push i {
    display: block;
    width: 6px;
    height: 30px;
    background-color: #1e90ff;
    margin-top: 3px;
}
.offline .preloaded i {
    width: 10px;
}
.offline .preloaded p,.offline .brush-machine p,.offline .push p {
    font-size: 30px; /*px*/
    color: #708090;
    margin-left: 17px;
    line-height: 40px;
}
.offline .brush-machine {
    margin-top: 20px;
    display: flex;
}
.offline .push {
    margin-top: 20px;
    display: flex;
}
</style>
